﻿<html style="height:100%;">

	<head>
		<meta charset="UTF-8">
		<link rel="stylesheet" type="text/css" href="/css/downLoad.css" />
		<!-- 最新版本的 Bootstrap 核心 CSS 文件 -->
		<link rel="stylesheet" href="/css/bootstrap.min.css">
		<link rel="stylesheet" type="text/css" href="/css/xq.css" />
		<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
		<script src="/js/bootstrap.min.js"></script>

		<title></title>
		<style type="text/css">
			.more {
				cursor: pointer;
			}

			.more_ops {
				background-color: 999;
			}
		</style>
		<style type="text/css">
			.more {
				cursor: pointer;
			}

			.more_ops {
				background-color: 999;
			}

			.msg_img {
				height: 25px;
				width: 25px;
				margin-top:10px
			}

			.down_list {
				margin-top: 0px;
				margin-left: 24px;
				margin-right:24px
			}

			.down_list li {
				width: 100%;
				height: 45px;
				line-height: 45px;
				border-bottom: 1px dotted #99b5d1;
				/*overflow: hidden;*/
				font-size: 14px;
				padding-left: 16px

			}
			.nav-pills{
				border-bottom:1px solid #00478B;
				padding-bottom:43px;
				height:5px;
				line-height:5px;
				margin-left: 23px;
				margin-right:23px;

			}
				.container-fluid {
		    /*padding-right: 15px;*/
		    padding-left: 0px;
		    margin-right: auto;
		    margin-left: auto;
		}
		.navbar-default {
		    background-color: #f8f8f8;
		    border-color: #e7e7e7;
		    margin-top: -30px;
		}
		.navbar-nav li{
			width:100px;
			text-align: center;

		}
		/*.nav{
			margin-left:23px
		}*/
		.navbar-collapse {
			    padding-right: 0px;
			    padding-left: 0px;
			}
		</style>

	</head>

	<body style="height:100%;">
		<div class="down_con">
			<nav class="navbar navbar-default">
				<div class="container-fluid">
					<!-- Brand and toggle get grouped for better mobile display -->

					<!-- Collect the nav links, forms, and other content for toggling -->
					<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
						<ul class="nav navbar-nav" id="myTab">
							<li>
								<a href="#guang_one">我的信息</a>
							</li>
						</ul>
					</div>
					<!-- /.navbar-collapse -->
				</div>

				<!-- /.container-fluid -->
			</nav>
			<!--这里书写切换内容-->
			<div class="tab-content">
				<!--光伏一号-->
				<div class="tab-pane" id='guang_one'>
					<ul class="nav nav-pills">
						<li role="presentation">
							<a href="#g1_hhr">未读</a>
						</li>
						<li role="presentation">
							<a href="#g1_qyht">全部</a>
						</li>
					</ul>
					<div class="tab-content">
						<!--未读文件-->
						<div class="tab-pane active" id="g1_hhr">
							<ul class="down_list">
								<?
								// var_dump($read);
								// die;
								if(isset($unread) && count($unread)>0){
									foreach ($unread as $key => $val) { ?>
										<li style="clear: both;"><span style="float:left;margin-right:20px;"><img class="msg_img" src="/img/downLoad/wemsg.jpg"/></span><span class="left_list"><? echo $val['title']; ?></span><span class="right_list2 list3"><span ><span class="look" id='<? echo $val['id']; ?>'>查看</span></span>
											</span>
										</span><span class="right_list1"><? echo substr($val['updatetime'],0,10);?></span>
										</li>

								<?	}
								} ?>
							</ul>
							<div class="" style="float:right;margin-right:20px;margin-top:20px;">
								<img src="/img/downLoad/1.png" />
							</div>
						</div>
						<!--全部文件-->
						<div class="tab-pane" id="g1_qyht">
							<ul class="down_list">
								<!-- <li><span class="left_list"></span><span class="right_list2 list3">全部设为已读</span><span class="right_list1"></span></li> -->
								<?
								// var_dump($read);
								// die;
								if(isset($read) && count($read)>0){
									foreach ($read as $key => $val) { ?>
										<li style="clear: both;"><span style="float:left;margin-right:20px;"><img class="msg_img" src="/img/downLoad/wemsg.jpg"/></span><span class="left_list"><? echo $val['title']; ?></span><span class="right_list2" style="width:150px;color: #00478B;"><span ><span class="look" id="<? echo $val['id']; ?>">查看</span></span>
											</span>
											</span><span class="right_list1"><? echo substr($val['updatetime'],0,10);?></span></li>

								<?	}
								} ?>
							</ul>
							<div class="" style="float:right;margin-right:20px;margin-top:20px;">
								<img src="/img/downLoad/1.png" />
							</div>
						</div>
					</div>

				</div>
				<!--光伏二号-->

				<!--污水一号-->

			</div>
		</div>
		<div class="black_cover">
			<div class="out_detail" style="overflow-y:auto;">
			<div class="content_zl" style="width:1000px;padding-right:40px;">
				<div class="" style="overflow: hidden;margin-top:20px;">
					<p class="title_zl" style="float:left;">碳银光伏二号征集事业合伙人</p>
				</div>
				<div class="msg_detail">
					<p><span id="datetime" style="color:#999;">2017-09-01</span>&nbsp;<span style="color:#00478B;">碳银网</span></p>

				</div>
				<div class="pic_detail">
				</div>
			</div>
		</div>
		</div>
	</body>
</html>
<script>
	$(function() {
		$('#myTab a:first').tab('show');

		$('#guang_one a:first').tab('show');
		$('#guang_two a:first').tab('show');
		$('#wuni a:first').tab('show');
		$('#wushui a:first').tab('show');
		//
		$('#myTab a').click(function(e) {
			e.preventDefault();
			$(this).tab('show');
		})
		$('#guang_one a').click(function(e) {
			e.preventDefault();
			$(this).tab('show');
		})
		$('#guang_two a').click(function(e) {
			e.preventDefault();
			$(this).tab('show');
		})
		$('#wuni a').click(function(e) {
			e.preventDefault();
			$(this).tab('show');
		})
		$('#wushui a').click(function(e) {
			e.preventDefault();
			$(this).tab('show');
		})
		$('.more').click(function() {
			$(this).find('.more_ops').css({ 'display': 'block' })
		})
		$('.more_ops').mouseleave(function() {
			$(this).css({ 'display': 'none','z-index':'999' })
		})
	})
	$('.look').click(function(){
		var id=$(this).attr('id');
		$.ajax({
			url: "/uc/msgDetail",
				type: "Post",
				dataType: "json",
				data:{id:id},
				success: function(response) {
						$('.title_zl').empty();
						$('.title_zl').html(response.data.title);
						$('#datetime').empty();
						$('#datetime').html(response.data.updatetime);
						$('.pic_detail').empty();
						$('.pic_detail').html(response.data.content);
						$('.black_cover').css({'display':'block'})
				},
				error: function(data) {
					console.log(data)
				}
		});

	})
	$('.black_cover').click(function(){
		$(this).css({'display':'none'})
		if($("#g1_hhr").attr('class')=='tab-pane active')
		{
			location.reload();
		}
	})
	$('.content_zl').click(function(event){
		event.stopPropagation();
	})
	$('.out_detail').click(function(event){
		event.stopPropagation();
	})
</script>
